<%@ page contentType="text/html;charset=UTF-8" %>

<html>
  <head>
    <meta name="layout" content="main">
    <title>Facility Search Results</title>
    
    <g:javascript library="jquery"/>

  </head>
  <body>
    <h1>Search Results</h1>
    <p>
      Searched ${healththink.Facility.count()} records
      for items matching <em>${term}</em>.
      Found ${facilities.size()} Facilities:
    </p>
    <div>
      <table>
      <g:each var="facility" in="${facilities}">
        <tr>
          <td>
            *&nbsp;
          </td>
          <td>
            <g:link 
              style="font-size:16px;"
              controller="Facility" 
              action="view"
              params="[name: facility.name]"
              id="${facility.id}">
                ${facility.name}
            </g:link>
          </td>
          <td>
            Distance:
          </td>
          <td>
            <div id="dis_${facility.id}" name="${facility.id}">
              calculating...
            </div>
          </td>
          <td>
            <input type="button" onclick="showMap('${facility.id}');" class="MapButtonLink" value="Show Map" />
          </td>
          <td>
            <input id="lat_${facility.id}" type="hidden" name="Lat" value="${facility.latitude}"/>
            <input id="lng_${facility.id}" type="hidden" name="Lng" value="${facility.longitude}"/>
          </td>
        </tr>
      </g:each>
      </table>
    </div>
    <br/>
    <div>
      <div id="map_canvas" class="mapCanvas"></div>
      <div id="map_directions" class="mapDirections"></div>
      <div style="clear: both;"></div>
    </div>
    <br/>
    <g:link action="search" style="font-size: 16px;">Search Again</g:link>
  </body>
</html>
